import QtQuick 1.0
//import ShellInvoker 1.0
import "../../../common/lib/kdeadmouseutils-build-desktop"

Item {
    id: listVItem
    property string motifSearch
    property string plId
    property string relatedVId
    property string appHome : "/socMDC/KdeadMouse/apps/youtube"
    property string currentVId 
    signal selectVideo(string videoId, int index)
    width: 1024
    height: 400
    
    /*onCurrentVIdChanged: {
      console.log('cha**********************nged:' + currentVId);
      vListId.currentItem.state='playing';
    }*/
    
    function getModelItem (index) {
      avanceAuDela(index);
      return vlModel.get(index);
    }
    
    function avanceAuDela (index) {
      if(index>4 && vlModel.count - index < 4){
	console.log("avancement au dela de:" + index);
	serverTube.goOn();
      }
    }
    
    ListModel {
	  id : vlModel
	  
	  
	  /*ListElement {
	      title: "Alicia Keys - No One"
	      vId : "rywUS-ohqeE"
	  }
	  ListElement {
	      title: "Alicia Keys - If I Ain't Got You"
	      vId : "Ju8Hr50Ckwk"
	  }
	   ListElement {
	      title: "Me singing Alicia Keys - If I Ain't Got You P:"
	      vId : "wo7DdYirwIw"
	  }*/
    }
    
    ShellInvoker {
	property string typeData : 'empty'
	id:serverTube
	waitFor:'start'
	onOutputLineChanged : {
	    if('empty' == serverTube.typeData){
	      typeData='retrieving';
	      return;
	    }
	    var out = serverTube.outputLine;
	    //console.log("outLine"  + out);
	    if("goOnEnd" == out){
	      typeData='stop';
	      console.log("outLine  ==>stoping");
	      return ;
	    }
	    //console.log("out##"  + serverTube.outputLine);
	    //{"title":"melange", "pId":"37C3E7FA3BFBE74C"}
	    var sl = "("+ out +")" ;//;"(\{\"title\":\"AliciaKeys&jeanne Cherhal\", \"pId\":\"C7956DDE99F32C16\"\})";
	    //console.log("eval##"  + sl);
	    try{
	      var l = eval(sl);
	      vlModel.append(l);
	    }catch(err){
	      console.log(err);
	      console.log("eval##"  + sl);
	    }
	}
	function goOn() {
	    if('retrieving' != typeData){
	      console.log('No RETRIEVING');
	      return ;
	    }
	    serverTube.write('go');
	}
	
	function sendOrder() {
	    var cmd = '';
	    if(listVItem.motifSearch){
	      cmd='sv,'+ listVItem.motifSearch;
	    }else if(listVItem.plId){
	      cmd='pc,'+ listVItem.plId;
	    }else if(listVItem.relatedVId){
	      cmd='rv,'+ listVItem.relatedVId;
	    }else{
	      console.log("type liste inconu")
	      return;
	    }
	    console.log("sendCmnd :"+ cmd);
	    serverTube.write(cmd);
	    console.log("send");
	}
    } 
   
      
    Rectangle {
	  id:rectDet
	  color: "#3E606F"
	  height: parent.height
	  anchors.verticalCenter:parent.verticalCenter
	  width: 400
	  anchors.left: parent.left
	  radius: 10
	  Image {
		anchors.centerIn: parent
		width:parent.width-20
		height:parent.height-10
		id:imgVid
		fillMode: Image.PreserveAspectFit
		//
		//source: "http://i.ytimg.com/vi/" + vListId.currentItem.vId+"/0.jpg"
		smooth: true
	  }
    }
    
    
    
    Rectangle {
	  id:rectList
	  color: "#3B60CF"
	  //opacity:0.8
	  anchors.left: rectDet.right
	  height: parent.height
	  width : parent.width - rectDet.width
	  anchors.verticalCenter:parent.verticalCenter
	  smooth: true
	  ListView {
		  id: vListId
		  width: parent.width - 40
		  height: parent.height - 40
		  anchors.centerIn: parent
		  focus: true
		  model:vlModel
		  orientation : ListView.Vertical
		  spacing : 10
		  onCurrentIndexChanged : {
		    listVItem.avanceAuDela(currentIndex);
		  }
		  delegate: Rectangle {
				  id:rectItem
				  color: "#91AA9D"
				  smooth: true
				  radius: 5
				  anchors.horizontalCenter:parent.horizontalCenter
				  width: ListView.view.width - 100
				  height: 40
				  Text {
				      anchors.centerIn: rectItem
				      text: title
				      color: "#193441"
				      font.pixelSize: 20
				    }
				   states: 
				   [
				   State {
					name: "active"; when: rectItem.activeFocus
					PropertyChanges { target: rectItem;scale: 1.2}
					
					PropertyChanges { target: imgVid; source: "http://i.ytimg.com/vi/"+vId+"/0.jpg" }
					//PropertyChanges { target: label; font.pixelSize: 16 }
				    },
				    
				    State {
					name: "playing";when: vId == listVItem.currentVId
					PropertyChanges { target: rectItem;border.width:4;border.color:'red'}
					
					//PropertyChanges { target: imgVid; source: "http://i.ytimg.com/vi/"+vId+"/0.jpg" }
					//PropertyChanges { target: label; font.pixelSize: 16 }
				    }
				  ]
				    transitions: Transition {
					NumberAnimation { properties: "scale"; duration: 100 }
				    }
				    
				    Keys.onReturnPressed : {
					listVItem.selectVideo(vId,index);
					console.log('index loading:' + index);
					event.accepted = true;
				    }
		  }
		  
	      }
    }
    
    //signals 
    onPlIdChanged : {
      vlModel.clear();
      serverTube.sendOrder();
    }
    
    onRelatedVIdChanged : {
      vlModel.clear();
      serverTube.sendOrder();
    }
    
    
    Component.onCompleted: {
      //shell,[arg1]
      serverTube.shellAction('/usr/bin/perl',['-I',listVItem.appHome +'/bin/PerlTube/WebService-GData/lib',listVItem.appHome +'/bin/PerlTube/perlTubeAPI.pl']);
    }  
   
        
}
 
